<!-- 上月本月昨日今日出货统计图表 -->
<div style="height:15px;"></div>
<div class="layui-row">
	<div class="layui-col-xs4 layui-col-sm4 layui-col-md4">
		<div class="layui-row" style="text-align: center;font-size:16px; background-color:#DCE6F2">上月：<a href="javascript:showDetail('上月出货-订单列表', '{:url(\'\', \'_ajax=1&fun=_getChartMonthChtj&detail=1&factory_id=\'.$thisFactoryId.\'&from=\'.$thisFrom)}')">出货</a>/<a href="javascript:showDetail('上月入仓-订单列表', '{:url(\'\', \'_ajax=1&fun=_getChartMonthChtj&detail=2&factory_id=\'.$thisFactoryId.\'&from=\'.$thisFrom)}')">入仓</a>情况</div>
		<div class="layui-row">
			<div id="last_month_shipment_chart_fob" class="layui-col-md3"></div>
			<div id="last_month_shipment_chart_cost" class="layui-col-md3"></div>
			<div id="last_month_shipment_chart_jianshu" class="layui-col-md3"></div>
			<div id="last_month_shipment_chart_orders" class="layui-col-md3"></div>
		</div>
	</div>
	
	<div class="layui-col-xs4 layui-col-sm4 layui-col-md4">
		<div class="layui-row" style="text-align: center;font-size:16px; background-color:#EBF1DE">本月：<a href="javascript:showDetail('上月出货-订单列表', '{:url(\'\', \'_ajax=1&fun=_getChartMonthChtj&detail=3&factory_id=\'.$thisFactoryId.\'&from=\'.$thisFrom)}')">出货</a>/<a href="javascript:showDetail('本月入仓-订单列表', '{:url(\'\', \'_ajax=1&fun=_getChartMonthChtj&detail=4&factory_id=\'.$thisFactoryId.\'&from=\'.$thisFrom)}')">入仓</a>情况</div>
		<div class="layui-row">
			<div id="this_month_shipment_chart_fob" class="layui-col-md3"></div>
			<div id="this_month_shipment_chart_cost" class="layui-col-md3"></div>
			<div id="this_month_shipment_chart_jianshu" class="layui-col-md3"></div>
			<div id="this_month_shipment_chart_orders" class="layui-col-md3"></div>
		</div>
	</div>
	<div class="layui-col-xs4 layui-col-sm4 layui-col-md4">
		<div class="layui-row" style="text-align: center;font-size:16px; background-color:#FDEADA">昨日：<a href="javascript:showDetail('上月出货-订单列表', '{:url(\'\', \'_ajax=1&fun=_getChartMonthChtj&detail=5&factory_id=\'.$thisFactoryId.\'&from=\'.$thisFrom)}')">出货</a>/<a href="javascript:showDetail('昨日入仓-订单列表', '{:url(\'\', \'_ajax=1&fun=_getChartMonthChtj&detail=6&factory_id=\'.$thisFactoryId.\'&from=\'.$thisFrom)}')">入仓</a>情况</div>
		<div class="layui-row">
			<div id="yestoday_shipment_chart_fob" class="layui-col-md3"></div>
			<div id="yestoday_shipment_chart_cost" class="layui-col-md3"></div>
			<div id="yestoday_shipment_chart_jianshu" class="layui-col-md3"></div>
			<div id="yestoday_shipment_chart_orders" class="layui-col-md3"></div>
		</div>
	</div>
</div>
<div class="layui-row">
	<div class="layui-col-xs2 layui-col-sm2 layui-col-md2">
		<div class="layui-row" style="text-align: center;font-size:16px; background-color:#F2DCDB">近2日下单</div>
		<div class="layui-row" id="recent_2days_order_chart">加载中...</div>
	</div>
	<div class="layui-col-xs8 layui-col-sm8 layui-col-md8">
		<div class="layui-row" style="text-align: center;font-size:16px; background-color:#F2F2F2">本月目标完成情况</div>
		<div class="layui-row">
			<div id="this_month_target_chart_fob" class="layui-col-md3"></div>
			<div id="this_month_target_chart_cost" class="layui-col-md3"></div>
			<div id="this_month_target_chart_leadtime" class="layui-col-md3"></div>
			<div id="this_month_target_chart_jianshu" class="layui-col-md3"></div>
		</div>
	</div>
	<div class="layui-col-xs2 layui-col-sm2 layui-col-md2">
		<div class="layui-row" style="text-align: center;font-size:16px; background-color:#F2DCDB">年度目标</div>
		<div class="layui-row" id="year_target_chart">加载中...</div>
	</div>
	
</div>

<script>
/*layui.extend({
	highcharts:'highcharts/highcharts'
})*/
layui.use(['jquery', 'layer', 'highcharts'], function() {
	var $ = layui.jquery;
	var layer = layui.layer;
		
	window.showChartTemplate = function(container, title, categories, series, bgcolor='#ffffff') {
		$('#'+container).html('');
		var chart = Highcharts.chart(container, {
			 chart: {
				backgroundColor:bgcolor,
			    type: 'column'
			},
	        title: {
	            text: title,
	            x: -20 //center
	        },
	        xAxis: {
	            categories: categories,
	            crosshair: true
	        },
	        yAxis: {
	        	labels:{
	        		enabled: false
	        	},
	            title: {
	                text: null
	            }
	        },
			plotOptions: {
				column: {
		            borderWidth: 0,
		            dataLabels: {
		                enabled: true,
		            }
		        }
			},
	        series: series
	    });
	}
	
	
	
	//上月本月昨日今日出货统计图表
	window.getChartMonthChtj = function(){
		$.ajax({
			type: "POST",
			url: "?c=dailyV2&m=index",
			data: "_ajax=1&fun=_getChartMonthChtj&factory_id="+factoryId+"&from="+from,
			dataType: "json",
			success: function(res){
				console.log(res.data);
				if(res.code == 1){
					var stat = res.data.stat;
					//var url='javascript:showDetail(\'上月出货-订单列表\', \'{:url(\'\', \'_ajax=1&fun=_getChtj&detail=1&factory_id=\'.$thisFactoryId.\'&from=\'.$thisFrom)}\')';
					showChartTemplate('last_month_shipment_chart_fob', '', ['FOB（元）'], stat.last_month.fob, '#DCE6F2');
					showChartTemplate('last_month_shipment_chart_cost', '', ['加工费（元）'], stat.last_month.cost, '#DCE6F2');
					showChartTemplate('last_month_shipment_chart_jianshu', '', ['件数（件）'], stat.last_month.jianshu, '#DCE6F2');
					showChartTemplate('last_month_shipment_chart_orders', '', ['订单数（个）'], stat.last_month.orders, '#DCE6F2');
					
					showChartTemplate('this_month_shipment_chart_fob', '', ['FOB（元）'], stat.this_month.fob, '#EBF1DE');
					showChartTemplate('this_month_shipment_chart_cost', '', ['加工费（元）'], stat.this_month.cost, '#EBF1DE');
					showChartTemplate('this_month_shipment_chart_jianshu', '', ['件数（件）'], stat.this_month.jianshu, '#EBF1DE');
					showChartTemplate('this_month_shipment_chart_orders', '', ['订单数（个）'], stat.this_month.orders, '#EBF1DE');
					
					showChartTemplate('yestoday_shipment_chart_fob', '', ['FOB（元）'], stat.yestoday.fob, '#FDEADA');
					showChartTemplate('yestoday_shipment_chart_cost', '', ['加工费（元）'], stat.yestoday.cost, '#FDEADA');
					showChartTemplate('yestoday_shipment_chart_jianshu', '', ['件数（件）'], stat.yestoday.jianshu, '#FDEADA');
					showChartTemplate('yestoday_shipment_chart_orders', '', ['订单数（个）'], stat.yestoday.orders, '#FDEADA');
					
					showChartTemplate('this_month_target_chart_fob', '', ['FOB完成率'+stat.this_month_target.fob.rate+'%'], stat.this_month_target.fob.series, '#F2F2F2');
					showChartTemplate('this_month_target_chart_cost', '', ['加工费完成率'+stat.this_month_target.cost.rate+'%'], stat.this_month_target.cost.series, '#F2F2F2');
					showChartTemplate('this_month_target_chart_leadtime', '', ['货期达标率'], stat.this_month_target.leadtime.series, '#F2F2F2');
					showChartTemplate('this_month_target_chart_jianshu', '', ['件数完成率'+stat.this_month_target.jianshu.rate+'%'], stat.this_month_target.jianshu.series, '#F2F2F2');
					
					categories = ['下单件数（件）'];
					showChartTemplate('recent_2days_order_chart', '', categories, stat.recent_2days, '#F2DCDB');
					
					categories = ['完成率：'+stat.year_target.rate+'%'];
					showChartTemplate('year_target_chart', '', categories, stat.year_target.series, '#F2DCDB');
					
				}else layer.msg(res.msg, {icon: 2,anim: 6});
			}
		});
	}

	setTimeout("getChartMonthChtj()", 3000);		// 出货统计图表
});
</script>